﻿/**
 *  主页面CSS样式
 *  by 杨婷
 **/
*{
	padding: 0;
	margin: 0;
	font-family:"microsoft yahei","微软雅黑",tahoma,arial;
	outline: none;
}
html{
	width: 100%;
}
body{
	background: #F4F4F4 none repeat scroll 0% 0;
	
}

/*top端样式*/
.topNav{
	color: #FFF;
	font-size: 12px;
	background: #002A16 none repeat scroll 0% 0%;
	height: 40px;
	border-bottom: solid 1px #6E706F;
	position: relative;
	z-index: 3;
	overflow: hidden;
}
ul,li{
	list-style: outside none none;
}
.laymid{
	width:1200px;
	margin: 0 auto;
}
.laymid{
	line-height: 40px;
}
.fl{
	float: left !important;
}
.fl img{
	width:20px;
	height: 20px;
	display: block;
	float: left;
	margin-top:10px;
	margin-right: 5px;
}
.fl li span{
	display: block;
	float: left;
}
.fl:after{
	content: "";
	display: block;
	width: 100%;
	clear: both;
}
.fr{
	float: right !important;
}
.fr .first{
	margin-right: 80px;
}

.fr li{
	float: left;
	margin: 0 5px;
	text-align: center;
}
/*top-message头像栏设置*/

.top-message{
	background:#00351B none repeat scroll 0 0;
	color:#E3F7FF;
	font-size:25px;
	height: 150px;
	line-height: 150px;

}
.mid-nav{
	width: 1200px;
	margin: 0 auto;
	display: block;
}
.message-holder{
	position: relative;
}
.message-holder .message-float{
	position: absolute;
	width: 400px;
	height: 550px;
	overflow: hidden;
	top:-400px;
	left: 0px;
	background-color:#014021 ;
	z-index:1;
	text-align: center;
	cursor: default;
	box-sizing: border-box;
	padding-top: 180px;
	line-height: 30px;
	transition-property: transform;
	transition-duration: 800ms;
	transition-timing-function:ease;
	
}
.message-float.float-up{
	transform:translateY(-400px);
}
.message-float.float-down{
	transform: translateY(400px);

}
.mask{
	display: block;
	background:#00351B;
	position: absolute;
	top: 0;
	left: 0;
	width:400px;
	height: 150px;
	z-index: 2;
	transition-property: background-color;
	transition-duration: 800ms;
	transition-timing-function: ease;
}
.message-holder.active .mask{
	background-color:#014021 ;
}
.top-message ul:after{
	display: block;
	content: "";
	width: 100%;
	clear: both;
}
.top-message ul,.top-message li{
	list-style: none;
}
.top-message li{
	float: left;
	width: 400px;
	height: 150px;
	text-align: center;
	cursor: pointer;
}
.top-message li:hover{
	text-shadow: 0px 0px 5px #FFFFFF !important;
}
.mid-nav-active{
	text-shadow: 0px 0px 5px #FFFFFF !important;
}
.user-logo{
	border: #039847 solid 1px;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	width: 90px;
	height: 90px;
	margin-top:30px;
	position: relative;
	z-index: 2;
}
.float-img{
	width:35px !important;
	height: 35px !important;
	border:none !important;
}
.img-first{
	margin-right: 30px;
}
.img-second{
    margin-left: 30px;
}
.float-p{
	color: #95B1A5;
	text-shadow: none;
	font-size: 16px;
}
#userImg,#emailIcon,#phoneIcon{
	cursor: pointer;
}
.msg-con{
	position: absolute;
	top: 500px;
	left: 0;
	width:100%;
	transition-property: transform;
	transition-duration: 800ms;
	transition-timing-function: ease;
}
.msg-up{
	transform: translateY(-350px);
}
.msg{

	display: block;
	width:100%;
	color:#FFFFFF;
	height: 50px;
	font-size: 16px;
	background:#CCCCCC;
	text-align: center;
	line-height: 40px !important;
	box-sizing: border-box;
	padding:5px;
	vertical-align: middle;
	cursor: pointer;
}
.msg-content{
	overflow-y:auto;
	height: 350px;
	width: 100%;
	word-break: break-all;
	text-shadow: none;
	font-size: 14px;
	color: #FFFFFF;

	background: #014021;
}
.msg-single{
	text-align: left;
	margin:5px 0;
	box-sizing: border-box;
	padding-left:40px;
	padding-right: 10px;
	line-height: 25px;
	position: relative;
}
.msg-single:before{
	content: "";
	background: url(../images/ico_reset.png) no-repeat scroll;
	background-size: contain;
	width:15px;
	height: 15px;
	margin-top: 5px;
	display: block;
	position:absolute;
	left:10px;
	top:0;
	
}
.icon-msg{
	height: 40px;
	display: inline-block;
}
.msg span{
	display: inline-block;
	height: 40px;
	width:40px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: #2A2939;
}
.icon-msg img{
	width:40px;
	height: 40px;
	margin:0 !important;
	font-size: 16px;
	
}
.msg-count{
	line-height: 40px !important;
	text-shadow: none;
	font-size:16px;
}
.arrow{
	float: right;
}
.arrow-up{
	background: url(../images/icon_up.png) no-repeat scroll;
	background-size: contain;
}
.msg-up .arrow-up{
	background: url(../images/icon_down.png) no-repeat scroll;
	background-size: contain;
}
/*内容栏布局*/
.container{
	width: 1200px;
	margin: 0 auto;
}
.container:after{
	content: "";
	display: block;
	width: 100%;
	clear: both;
}
h3{
	font-style: normal;
	font-size: 20px;
	font-weight: normal;
	display: block;
	float: left;
}
.nav-header{
	border-bottom:1px solid #949494;
	width:100%;
	box-sizing: border-box;
	padding:10px;
}
.con-header{
	border-bottom: 1px solid #949494;
	width:100%;
	box-sizing: border-box;
	padding:10px;
}
.cl,.cr{
	float: left;
}
.cl{
	width:340px;
	background-color: #FFFFFF;
	box-sizing: border-box;
	padding:50px 50px 50px 50px;
	
}
.b{
	padding:250px 20px;
	height: 650px;
}
.white{
	background-color: #FFFFFF;
}
.grey{
	background-color:#F4F4F4;
}
.cl ul,.cl li{
	list-style: none;
}
.cl li{
	text-align: center;
	line-height: 40px;
	font-size: 20px;
	display: inline-block;
	width: 100%;
	height: 40px;
	
	
}
.nav-list li:hover{
	background: #FAFAFA;
	cursor: pointer;
}
.li-active{
	background:#FAFAFA;
	border-right: 5px solid #03B55F;
	color:#03B55F;
}
.cr{
	box-sizing: border-box;
	width:860px;
	padding:50px 30px 50px 30px;
}
.cr:after{
	content: "";
	display: block;
	width: 100%;
	clear: both;
}
.cr-l{
	float: left;
	width:490px;
}
.cr-r{
	float: right;
	width:280px;
}
.clear{
	clear: both;
}
.tijiao{
	color:#EA4B36;
	margin-bottom: 30px;
	outline: none;
}
.chongtian{
	color:#EA8013 ;
	outline: none;
}
.tijiao{
	background: url(../images/icon_confirm.png) no-repeat 50px 0px;
	background-size: contain;
}
.chongtian{
	background: url(../images/ico_reset.png) no-repeat 50px 0px;
	background-size: contain;
}
.search-num{
	color: #3E3E3E;
	display: block;
	float: left;
	width:140px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-size:14px;
	margin-left: 20px;
	margin-right:20px;
	margin-top:4px;
}

/*编辑控件样式*/
.required{
	color:red;
	font-style: normal;
	margin-right: 5px;
}
.group{
	width:100%;
	height: 50px;
}
.group:after{
	content: "";
	width:100%;
	display: block;
	clear:both;
}
label{
	min-width:95px;
	text-align: left;
	display: block;
	float:left;
	vertical-align: top;
	margin-top: 4px;
}
.label-n{
	display:block;
	float: left;
	width:auto;
	min-width: 0;
	font-size:14px;
}
.input-n{
	display: block;
	height: 30px;
	border: none;
	color: #333333;
	font-size:16px;
	padding: 5px;
	box-sizing: border-box;
	float: left;
	
}
.input-b{
	display: block;
	float: left;
	height: 20px;
	border:1px solid #8C8A8B;
	color: #333333;
	font-size: 14px;
	padding:3px;
	box-sizing: border-box;
	margin-top: 4px;
}
.input-s{
	background:#03B55F;
	border:none;
	color:#FFFFFF;
	box-sizing: border-box;
	padding:0 15px;
	height: 25px;
	line-height: 25px;
	font-size:14px;
	margin:0 10px;
}
.input-d{
	background:#D1807F no-repeat url(../images/icon_web_delete.png) left scroll;
	background-size:contain;
	border:none;
	color:#FFFFFF;
	box-sizing: border-box;
	padding:0 10px 0 30px;
	height: 25px;
	line-height: 25px;
	font-size:14px;
}

.selected-style{
	display: inline-block;
	overflow: hidden;
	background:url(../images/icon_pulldown.png) no-repeat right  #FFFFFF;
	background-size: contain;
	width:250px;
	height: 30px;
}
textarea{
	resize: none;
	padding: 10px;
	box-sizing: border-box;
	width:600px;
	height: 200px;
	border: none;
	color: #002A16;
}
select{
	height: 30px;
	border: none;
	color: #333333;
	font-size:16px;
	width:270px;
	background:transparent;
}
select option{
	box-sizing: border-box;
	text-indent: 5px;
	border: none;
}
select option:hover{
	background-color: #002A16;
}
.tijiao-btn,.chongtian-btn{
	border:none;
	color:#EA4B36;
	background:transparent;
	font-size: 20px;
	cursor: pointer;
}
.chongtian-btn{
	color: #EA8013;
}
.s1{
	width:250px;
}
.s2{
	width:150px;
}
.s3{
	width:70px;
}
.s4{
	width:180px;
}
.s5{
	width:85px;
}
.s6{
	width:390px;
}
.tip{
	color:#AAABAB;
}
#progress_info,#error,#error2,#abort,#warnsize{
	display: none;
}
.cell{
	display: block;
	float: left;
	height: 30px;
	line-height: 30px;
	box-sizing: border-box;
	padding:2px;
}
/*编辑页上传图片样式*/
.edittarget{
	width:180px;
	height: 180px;
	overflow: hidden;
	display: inline-block;
	background: #FFFFFF;
}
.img-demo{
	//width:50px;
	//height: 50px;
	//margin: 65px;
	width: 180px;
	height: 180px;
	margin: 0px;
}
.img-show{
	width: 180px;
	height: 180px;
	
}
.img-shangchuan{
	width:100%;
	height: 100%;
}
/*goods展示*/
.cr-r-r{
	margin-bottom: 10px;
}
.cr-r-r:after{
	content: "";
	display: block;
	width:100%;
	clear: both;
}
.cr-content{
	padding:20px;
	min-height: 400px;
}
.cr-content:after{
	content: "";
	display: block;
	width:100%;
	clear:both;
}
.goods-con{
	display: block;
	float: left;
	border:1px solid #8A8A8A;
	width:116px;
	box-sizing: border-box;
	padding:5px;
	font-size: 12px;
	margin: 5px;
	position: relative;
	cursor: pointer;
	text-decoration: none;
	color: #666666;
}

.goods-img{
	width:106px;
	height: 106px;
}
.goods-desc{
	overflow: hidden;
	text-overflow: ellipsis;
	width:106px;
	height:42px;
	box-sizing: border-box;
	padding:5px 0;
	display: block;
	text-align: center;
}
.goods-desc-a{
	color:#666666;
	text-decoration: none;
}
.goods-desc-a:hover{
	color: #666666;
	text-decoration: underline;
}
.goods-detail-con{
	position: absolute;
	left:0px;
	top: 106px;
	border: 1px solid #DDDDDD;
	border-top: solid 5px #03B55F;
	width:250px;
	height: 320px;
	background: #FFFFFF;
	z-index:2;
	box-sizing: border-box;
	padding:5px 10px;
	display: none;
}
.hover{
	display:block;
}
.g-d-header{
	width:100%;
	box-sizing: border-box;
	padding:5px;
	border-bottom: 1px dashed #CCCCCC;
	height: 30px;
	line-height: 20px;
	font-size: 14px;
}
.glDelete,.glModify,.g-d-span,.g-d-span-delete,.g-d-span-edit{
	float: left;
	margin-right: 5px;
}
.glDelete,.glModify{
	width:20px !important;
	height: 20px !important;
	cursor: pointer;
}
.glClose{
	float: right;
	width:20px !important;
	height: 20px !important;
	cursor: pointer;
}
.g-d-content{
	box-sizing: border-box;
	padding:5px;
	line-height: 25px;
	word-break: break-all;
	overflow-y: auto;
	height: 265px;
}
.g-d-content img{
	max-width:200px !important;
}
.f2{
	font-size: 12px;
}
.m2{
	margin-left: 95px;
}
.m3{
	margin-left: 10px;
}
.openfile{
	font-size: 12px;
	border:1px solid #434343;
	float: left;
	box-sizing: border-box;
	padding: 5px 10px 5px 30px;
	background: url(../images/icon_wenjianjia.png) no-repeat left;
	background-size: contain;
	cursor: pointer;
}
/*footer样式*/
.footer{
	width: 100%;
	text-align: center;
	font-size:12px;
	color:#333333;
	position: relative;
	line-height: 28px;
}
.footer a{
	color: #333333;
	text-decoration: none;
}
.footer a:hover{
	color: #333333;
	text-decoration: underline;
}
/*图片文件信息栏样式*/
#fileinfo{
	color:gray;
	box-sizing: border-box;
	line-height: 1.2;
	font-size: 12px;
	padding: 5px;
	display: none;
}
#filedim,#filesize,#filetype{
	word-break: break-all;
}
/*进度条样式*/
#errorMsg,#errorFormMsg{
	color: red;
	font-size: 12px;
	padding:0 5px;
	box-sizing: border-box;
	word-break: break-all;
	width:100%;
	display: none;
}
#errorFormMsg{
	font-size: 18px;
}
#proBar{
	float: left;
	width: 300px;
	background: #FFF none repeat scroll 0% 0%;
	border: 2px solid #4DBF7D;
	height: 12px;
	border-radius: 8px;
	position: relative;
	margin-top:70px;
	line-height: 12px;
	display: none;
	
}
#remaining{
	position: absolute;
	left: 0px;
	top: -30px;
	display: inline-block;
	color: #4DBF7D;
	font-size: 16px;
}
#percentNum{
	position: absolute;
	right: 0px;
	top: -30px;
	display: inline-block;
	color: #4DBF7D;
	font-size: 16px;
}
#percent{
	float: left;
	height: 12px;
	overflow: hidden;
	background: #4DBF7D none repeat scroll 0% 0%;
	border-radius: 8px;
	color:#4DBF7D;
	font-size: 12px;
}
#percentMsg{
	position: absolute;
	left: 0;
	top: 25px;
	display: inline-block;
	max-width: 100px;
	word-break: break-all;
	text-align: left;
	line-height: 1.2;
	color: #4DBF7D;
	font-size: 16px;
}
#speed{
	position: absolute;
	right: 0;
	top: 25px;
	display: inline-block;
	color: #4DBF7D;
	font-size: 16px;
	line-height: 1.2;
}
@media only screen and (max-width:1200px ) {
	.cl{
		width: 200px;
	}
	#proBar{
		width:150px;
	}

	.tijiao,.chongtian{
		background-position: 0px 0px;
	}
	.laymid{
		width:100%;
		min-width: 1024px;
	}
	.mid-nav{
		width: 100%;
		min-width: 1024px;
	}
	.top-message li{
		width:33%;
	}
	.mask{
		width: 100%;
	}
	.message-holder .message-float{
		width: 100%;
	}
	.cr{
		width:824px;

	}
	.container{
		width:100%;
		min-width: 1024px;
	}
	.cr-r{
		width:210px;
	}
	.top-message,.topNav{
		width:100%;
		min-width: 1024px;
	}
	.goods-con{
		width: 110px;
	}
	.goods-img{
		width:100px;
		height: 100px;
	}
}

